<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>css简介</title>
    <style>
        p{
            color: aliceblue;
            font-size: 50px;
        }
    </style>
</head>
<body>
    <!-- 
        网页分成
        结构  html
        表现  css
        行为   javaScript
        css
        层叠样式表
        网页实际上是一个多层的结构 通过css可以为网页的每一层设置样式

        第一种方式（内联样式 行内样式）
        在标签内部通过style属性设置元素的样式
        问题 使用内联样式 只对一个标签生效
        并且样式需要变化时  需要一个一个修改 不方便维护
        注意 开发时绝对不要使用内联样式

        第二种方式 内部样式表
        将样式写到head中的style标签里面
        然后通过css的选择器选中元素并为其设置各种样式
        可以同时为了多个标签设置样式，并且修改时只需要修改一处
        问题
        我们的内部样式表只能对一个网页起作用
        他里边的样式不能跨页面复用

        第三种方式 外部样式表  （最佳）
        可以将css样式编写到一个外部的css文件中
        然后通过link标签引入外部的css文件
        外部样式需要link标签进行引入
        使样式可以在不同页面复用
        将样式编写到外部的css文件中，可以使用到浏览器的缓存机制中 
        加快网页的加载速度，提高用户体验
     -->
     <link rel="stylesheet" href="./style.css">
</body>
</html>